<template>
    <view class="addresslist">
        <block v-for="(item, index) in AddressList" :key="index">
            <view @click="selEvent(item)" class="address-item">
                <view class="address-name"
                    >{{ item.name }} <text style="color: #d5d5d5">|</text>
                    <text class="address-phone">{{ item.phone }}</text></view
                >
                <view class="address-bifo">{{
                    item.address || item.province + item.city + item.area + item.details
                }}</view>
                <view class="address-bottom">
                    <view class="mo"><text v-if="item.status == 1">默认地址</text></view>
                    <view class="address-right">
                        <!-- v-if="item.status==0" -->
                        <view @click.stop="editAddress(item.id)"
                            ><image src="https://smosun-minapp.oss-cn-shanghai.aliyuncs.com/weapp/img/edit.png" mode=""></image><text>编辑</text></view
                        >
                        <view @click.stop="delAddress(item, index)"
                            ><image src="https://smosun-minapp.oss-cn-shanghai.aliyuncs.com/weapp/img/laji.png" mode=""></image><text>删除</text></view
                        >
                    </view>
                </view>
            </view>
        </block>
        <u-loadmore
            v-if="more"
            :status="status"
            loadingText="加载中"
            loadmoreText="上拉加载更多"
            nomoreText="已经到底啦～"
            fontSize="28"
            iconSize="30"
            marginTop="20"
            marginBottom="30"
        ></u-loadmore>
        <view style="padding-top: 30rpx; width: 100%; height: calc(96rpx + env(safe-area-inset-bottom))"></view>
        <view class="footer">
            <navigator @click="goToAddress" hover-class="none" class="footer-item">新增收货地址</navigator>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            pageNum: 1,
            pageSize: 8,
            isloading: false,
            total: 0,
            AddressList: [],
            status: 'loadmore',
            more: false,
            fromOrder: 0,
        };
    },
    onLoad(option) {
        if (option.fromOrder) {
            this.fromOrder = option.fromOrder;
            uni.setNavigationBarTitle({
                title: '选择收货地址',
            });
        } else {
            uni.setNavigationBarTitle({
                title: '收货地址',
            });
        }
    },
    onShow() {
        this.AddressList = [];
        this.getAddress(true);
    },
    onPullDownRefresh() {
        this.getAddress(true);
    },
    onUnload() {
        uni.$emit('addressList', this.AddressList);
    },
    onReachBottom() {
        if (this.more == false) return;
        this.status = 'loading';
        this.pageNum = ++this.pageNum;
        this.getAddress(false);
    },
    methods: {
        selEvent(item) {
            if (this.fromOrder == 1) {
                uni.$emit('address', item);
                uni.navigateBack();
            }
        },
        getAddress(isFresh) {
            if (isFresh) {
                this.pageNum = 1;
                this.pageSize = 20;
            }
            let data = {
                pageNum: this.pageNum,
                pageSize: this.pageSize,
            };
            this.request.httpTokenRequest('/mp-api/wx/address/list', data, 'POST', false).then((res) => {
                uni.stopPullDownRefresh();
                if (res.code == 0) {
                    res.data.list.sort(function (a, b) {
                        return b.status - a.status;
                    });
                    if (res.data.list && isFresh) {
                        this.AddressList = res.data.list;
                    } else {
                        res.data.list.forEach((item) => {
                            this.AddressList.push(item);
                        });
                    }
                    if (res.data.total > this.AddressList.length) {
                        this.status = 'loadmore';
                        this.more = true;
                    } else {
                        this.more = false;
                        this.status = 'nomore';
                    }
                } else {
                    this.more = false;
                    this.status = 'nomore';
                }
            });
        },
        editAddress(id) {
            uni.navigateTo({
                url: `/packageMall/pages/address/addAddress?id=${id}&num=${this.AddressList.length}`,
            });
        },
        goToAddress() {
            uni.navigateTo({
                url: `/packageMall/pages/address/addAddress?num=${this.AddressList.length}`,
            });
        },
        delAddress(item, index) {
            if (item.status == 1) {
                uni.showModal({
                    confirmText: '确定',
                    showCancel: false,
                    title: '默认地址不可删除！',
                });
            } else {
                uni.showModal({
                    cancelText: '取消',
                    confirmText: '确定',
                    title: '是否确认删除此地址？',
                    success: (res) => {
                        if (res.confirm) {
                            let that = this;
                            that.request
                                .httpTokenJsonRequest(`/mp-api/wx/address/delete/${item.id}`, null, 'POST', false)
                                .then((res) => {
                                    if (res.code != 0) {
                                        that.helper.showToast(res.message);
                                        return;
                                    }
                                    that.helper.showToast('删除成功');
                                    setTimeout(function () {
                                        that.AddressList.splice(index, 1);
                                    }, 1000);
                                });
                        }
                    },
                });
            }
        },
    },
};
</script>

<style>
</style>
